.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
html, body{
    height: 100%;
}
.body{
    background-image: url(../imgs/wodefw.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
}
.sec{
    flex: 1;
    display: flex;
    .left{
        display: flex;
        flex-wrap: wrap;
        width: 75%;
        height: 90%;
        li{
            width: 50%;
            text-align: center;
            opacity: 0.8;
            height: 20%;
            .px2rem(padding-top, 50);
        }
    }
    .right{
        flex: 1;
        display: flex;
        flex-direction: column;
        text-align: center;
        .px2rem(padding-top, 50);
        .aa{
            .px2rem(padding-top, 200);
        }
        .bb{
            .px2rem(padding-top, 50);
        }
        p{
            color: rgba(255,255,255,0.8);
            .px2rem(padding-top, 20);
        }
    }
}
.foot{
    .px2rem(height, 100);
    background: rgba(225,198,166,0.5);
    ul{
        display: flex;
        justify-content: space-around;
        li{
            .px2rem(height, 100);
            display: flex;
            align-items: center;
            span{
                color: rgba(255,255,255,0.8);
                .px2rem(padding-left, 10);
            }
            &:nth-child(1){
                span{
                    color: #4fd514;
                }
            }
        }
    }
}
